<template>
  <div>
    <button @click="msg = '新的值'">改变msg</button>
    <h1 ref="h1">我是h1 -- {{ msg }}</h1>

    <button @click="sonShow = false">销毁son</button>
    <my-son v-if="sonShow"/>
  </div>
</template>

<script>
import MySon from './components/MySon'
export default {
  components: {
    MySon
  },
  data() {
    return {
      msg: '你好',
      a1: '',
      b1: '',
      sonShow: true
    }
  },

  // beforeMount () {
  //   console.log('beforeMount', document.querySelector('h1'), this.$refs.h1 )
  // },

  // mounted () {
  //   console.log('mounted', document.querySelector('h1'),  this.$refs.h1 )
  // },
  // beforeUpdate () {
  //   console.log('beforeUpdate',this.msg, this.$refs.h1.innerHTML)
  // },

  // updated () {
  //   console.log('updated',this.msg, this.$refs.h1.innerHTML)
  // }
}
</script>

<style>

</style>